<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script type="text/javascript" src="../helper.js"></script>
  <style type="text/css">
    html, body{
      background: white;
    }

    body, #content div, #content span, #content h1, #content iframe, #content input, #content textarea {
      border : 1px solid black;
    }

    body, #content div {
      padding : 10px; margin: 5px
    }
  </style>
</head>
<body>
  <div id="content">
    <h1 id="h1">TabIndex</h1>
    <div id="hello" tabIndex="1">
      <div id="bar">
        <div id="foo" tabIndex="1">
          text0
        </div>
      </div>
      <div id="world" tabIndex="1">
        <span>text1</span>
      </div>
      <div id="world" tabIndex="1">
        <span>text1</span>
      </div>
    </div>

    <h1 id="h2">Fields</h1>

    <input id="f1" type="text" value="text field"/>

    <textarea>hello</textarea>

    <input type="checkbox" id="chk1" name="bar"/><label for="chk1">Check 1</label>
    <input type="radio" id="rd1" name="foo" value="first"/><label for="rd1">Radio 1</label>
    <input type="radio" id="rd2" name="foo" value="second"/><label for="rd2">Radio 2</label>

    <h1 id="h3">Iframe</h1>

    <iframe src="data/Empty_1.html" style="width:200px;height:100px">
    </iframe>
  </div>
</body>
</html>
